<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>青春花语--联系商家/售后服务</title>
    <link rel="stylesheet" href="../CSS/contact.css">
    <link rel="stylesheet" href="../CSS/public.css">
    <script src="../js/contact.js"></script>
</head>

<body>
     <!-- 头部导航 -->
    <div class="top-nav">
        <ul>
            <li><a href="../index.html"><span>|</span>青春花语首页<span>|</span></a></li>
            <li><a href="../HTML/shopping_mall.html"><span>|</span>商城<span>|</span></a>
            </li>
            <li><a href="../HTML/collect.html"><span>|</span>商品收藏<span>|</span></a>
            </li>
            <li><a href="../HTML/contact.html"><span>|</span>联系客服<span>|</span></a>
            </li>
            <li><a href="../HTML/login.html"><span>|</span>欢迎登录青春花语<span>|</span></a>
            </li>
            <li><a href="../HTML/register.html"><span>|</span>免费注册<span>|</span></a>
            </li>
            <li><a href="../HTML/person.html"><span>|</span>个人资料<span>|</span></a>
            </li>
            <li><a href="../HTML/my_order.html"><span>|</span>我的订单<span>|</span></a>
            </li>
        </ul>
    </div>
    <!-- 开始的固定语句 -->
    <div class="con1">
        <div id="show">
            <p>你好！欢迎来到青春花语</p>
            <p>这里是小花客服</p>
            <p>请问有什么可以帮到您呢~</p>
        </div>
        <div id="box">
            <input id="inp" type="text">
            <button id="but">发送信息</button>
        </div>
    </div>
    <!-- 右侧侧边栏 -->  
<div class="sidebar">  
    <!-- 产品展示 -->  
    <div class="product-showcase">  
        <h3>热门产品</h3>  
        <div class="product">  
            <img src="../images/s7.jpg" alt="Flower 1">  
            <a href="../HTML/pic_big.html">玫瑰花束</a>  
        </div>  
        <div class="product">  
            <img src="../images/s9.jpg" alt="Flower 2">  
            <a href="../HTML/pic_big.html">爱情-love</a>  
        </div> 
        <div class="product">  
            <img src="../images/s1.jpg" alt="Flower 3">  
            <a href="../HTML/pic_big.html">星河璀璨</a>  
        </div>
        <div class="product">  
            <img src="../images/s2.jpg" alt="Flower 4">  
            <a href="../HTML/pic_big.html">金色暖阳</a>  
        </div>
        <div class="product">  
            <img src="../images/s5.jpg" alt="Flower 5">  
            <a href="../HTML/pic_big.html">一路向阳</a>  
        </div>
        <div class="product">  
            <img src="../images/s8.jpg" alt="Flower 6">  
            <a href="../HTML/pic_big.html">乘风破浪</a>  
        </div>
        <div class="product">  
            <img src="../images/s6.jpg" alt="Flower 7">  
            <a href="../HTML/pic_big.html">恋恋情深</a>  
        </div>
        <div class="product">  
            <img src="../images/s3.jpg" alt="Flower 8">  
            <a href="../HTML/pic_big.html">星辰大海</a>  
        </div>
    </div>  
    <!-- 促销活动 -->  
    <div class="promotion">  
        <h3>促销活动</h3>  
        <p>父亲节特惠，满100减20！</p>
        <p>618特惠，满200减50！</p>
        <br>   
    </div>  
    <!-- 联系方式 -->  
    <div class="contact-info">  
        <h3>联系我们</h3>  
        <p>地址：广东科学院xx栋</p>  
        <p>电话：123-3333-3333</p>  
    </div>  
</div>  
</body>

</html>